<meta charset="UTF-8">
<style>
  *{margin:0px;padding:0px;}
  body{
    background:url(https://img2.baidu.com/it/u=57628836,2989936375&fm=253&fmt=auto&app=138&f=JPEG?w=767&h=500);
    background-size:cover;
  }
  .login_div{
    background:rgba(0,0,0,0.3);
    position:absolute;
    color:white;
    left:50%;
    top:20%;
    margin-left:-150px;
    width:300px;
    height:290px;
    padding:20px;
    border: 1px solid #ccc;
  }
  .company_name{
    font-size:18px;
    text-align: center;
    margin-top:10px;
    margin-bottom: 10px;
  }
  .input_div{
    margin-top:20px;
    margin-bottom:20px;
    text-align: center;
  }
  input{
    width:260px;
    height:36px;
    outline: none;
    padding-left:5px;
  }
  .btn{
    width:260px;
    height:36px;
    line-height: 36px;
    background:orange;
    margin-top:20px;
    text-align: center;
    border-radius: 3px;
    margin-left:auto;
    margin-right:auto;
  }
</style>
<div class="login_div">
  <div>注册:</div>
  <div class="company_name">新凌通信物料管理系统</div>
  <div class="input_div">
    <input id="u" placeholder="用户名" /></div>
  <div class="input_div">
    <input id="p" placeholder="密码" type="password" /></div>
  <div class="input_div">
    <input id="p2" placeholder="确认密码" type="password" /></div>
  <div id="b" class="btn" onclick="reg()">注册</div>
</div>
<script>
  function reg(){
    var req = new XMLHttpRequest();
    req.open("post","/sysuser_reg");
    req.setRequestHeader("Content-Type",
            "application/json;charset=utf-8")
    var data = {
      username:u.value,
      password:p.value
    }
    req.send(JSON.stringify(data));
    req.onreadystatechange = function(){
      if(req.readyState==4&&
              req.status==200){
        alert(req.responseText);
      }
    }
  }
</script>